<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<title>{$title}</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
	<meta name="apple-mobile-web-app-capable" content="yes" />
	<meta name="apple-mobile-web-app-status-bar-style" content="black" />
	<meta name="format-detection" content="telephone=no" />
	<link href="{$Think.config.RESOURCEURL}wx_assets/iconfont/iconfont.css{$Think.config.RESOURCE_VER}" rel="stylesheet">
	<link href="{$Think.config.RESOURCEURL}wx_assets/css/common.css{$Think.config.RESOURCE_VER}" rel="stylesheet" type="text/css">
	<link href="{$Think.config.RESOURCEURL}wx_assets/micontent/materiaDetail.css{$Think.config.RESOURCE_VER}" rel="stylesheet">
	<link href="{$Think.config.RESOURCEURL}wx_assets/micontent/editor.css{$Think.config.RESOURCE_VER}" rel="stylesheet">
	<link href="{$Think.config.RESOURCEURL}wx_assets/micontent/emoji.css{$Think.config.RESOURCE_VER}" rel="stylesheet">
	<script type="text/javascript" src="{$Think.config.RESOURCEURL}wx_assets/js/zepto.1.1.3.min.js{$Think.config.RESOURCE_VER}"></script>
	<script type="text/javascript" src="{$Think.config.RESOURCEURL}wx_assets/js/zepto.alert.js{$Think.config.RESOURCE_VER}"></script>
	<script src="{$Think.config.RESOURCEURL}wx_assets/js/util.js{$Think.config.RESOURCE_VER}" type="text/javascript"></script>
	<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
	<script src="{$Think.config.RESOURCEURL}wx_assets/js/wx_share.js{$Think.config.RESOURCE_VER}" type="text/javascript"></script>
	<script type="text/javascript" src="{$Think.config.RESOURCEURL}wx_assets/js/product/product.js{$Think.config.RESOURCE_VER}"></script>
	<script type="text/javascript" src="{$Think.config.RESOURCEURL}wx_assets/js/video-js/video.js{$Think.config.RESOURCE_VER}"></script>
	<link href="{$Think.config.RESOURCEURL}wx_assets/js/video-js/video-js.css{$Think.config.RESOURCE_VER}" rel="stylesheet">

	<link href="{$Think.config.RESOURCEURL}wx_assets/js/area/mobiscroll.javascript.min.css{$Think.config.RESOURCE_VER}" rel="stylesheet" type="text/css">
	<link href="{$Think.config.RESOURCEURL}wx_assets/micontent/magic-input.min.css{$Think.config.RESOURCE_VER}" rel="stylesheet" type="text/css">
	<script type="text/javascript" src="{$Think.config.RESOURCEURL}wx_assets/js/area/area_array.js{$Think.config.RESOURCE_VER}"></script>
	<script type="text/javascript" src="{$Think.config.RESOURCEURL}wx_assets/js/area/mobiscroll.javascript.min.js{$Think.config.RESOURCE_VER}"></script>
	<style media="screen">
		.reward,.share-btn-wrapper {
			background: #506ce7;
		}
	</style>
</head>
<body>
<div class="content" <if condition="$isQuan eq 0">style="margin-bottom:0"</if>>
<div id="materiaDetail" class="materiaDetail">
	<div class="article">
		<if condition="$templateType != 3">
			<div class="title"><php>echo str_replace('\"','"',$title);</php></div>
		</if>
		<div class="article-content">
			<div class="wechat-template">
				<span class="create-time"><php>echo date('Y-m-d', strtotime($createTime));</php></span>
				<span class="quan-name" onclick="toFocusLink()">{$mediaName}</span>
			</div>
			<div class="common" id="articleContent">{$content}</div>
			<div class="comment" id="commentBox" style="display:none">
				<div class="commentTitle"><span>精选评论</span></div>
				<div  id="comment"></div>
			</div>
		</div>
	</div>
</div>
<div class="mark" style=""></div>
<!-- 二维码 -->
<if condition="$contactInfo['qrcode'] neq ''">
	<div class="qrcodeShow">
		<a class="close" onclick="$('.mark').hide();$('.qrcodeShow').hide();"></a>
		<div class="card">
			<span>长按二维码找到Ta</span>
			<img src="{$contactInfo['qrcode']}" />
		</div>
	</div>
</if>
<!-- 商品 -->
<if condition="$proList neq ''">
	<div class="productList materiaDetail" id="productInfo">
		<ul>
			<volist name="proList" id="vo">
				<li class="product">
					<div class="reason">
						{$vo.recommend}
					</div>
					<if condition="$vo['picUrl1'][1] neq ''">
						<img src="{$vo['picUrl1'][1]['picUrl']}">
						<else/>
						<img src="{$vo.picUrl}">
					</if>
					<span class="pname">{$vo.name}</span>
					<span class="price">
						<if condition="$vo.teambuy eq '1'">
							￥{$vo.teamPrice}
							<!--<del style="padding-left:12px;color:#333">￥{$vo.fixedPrice}</del>-->
							<elseif condition="$vo.$freeBuy eq '1'"/>
							￥{$vo.freeBuyMoney[0]}~￥<php>echo end($vo['freeBuyMoney']);</php>
							<elseif condition="$vo.playType eq '5' and $isEnjoyMiPrice eq '1'"/>
							<if condition="$vo.supportSpecification eq '1' AND $vo['minMiPrice'] neq $vo['maxMiPrice']">
								密友价:￥{$vo.minMiPrice}~{$vo.maxMiPrice}
								<elseif condition="$vo.supportSpecification eq '1'"/>
								密友价:￥{$vo.minMiPrice}
								<else/>
								密友价:￥{$vo.miPrice}
							</if>
							<elseif condition="$vo.discountedPrice neq ''"/>
							<if condition="$vo.supportSpecification eq '1' AND $vo['minDisPrice'] neq $vo['maxDisPrice']">
								￥{$vo.minDisPrice}~{$vo.maxDisPrice}
								<elseif condition="$vo.supportSpecification eq '1'"/>
								￥{$vo.minDisPrice}
								<else/>
								￥{$vo.discountedPrice}
							</if>
							<else/>
							<if condition="$vo.supportSpecification eq '1' AND $vo['minFixedPrice'] neq $vo['maxFixedPrice']">
								￥{$vo.minFixedPrice}~{$vo.maxFixedPrice}
								<elseif condition="$vo.supportSpecification eq '1'"/>
								￥{$vo.minFixedPrice}
								<else/>
								￥{$vo.fixedPrice}
							</if>
						</if>
					</span>
					<a onclick="product.toDetail('{$vo.fromCustomerId}','{$vo.id}')">去看看</a>
				</li>
			</volist>
		</ul>
	</div>
</if>
<if condition="$associatedShop eq '1' and $isQuan eq '1'">
	<div class="productList materiaDetail">
		<div class="imgDiv">
			<img src="{$headimgurl}">
		</div>
		<div class="title">{$nickname}</div>
		<a onclick="product.goShop()">我的店铺</a>
	</div>
</if>
<!--<div class="customer">-->
<!--<img src="{$Think.config.RESOURCEURL}wx_assets/micontent/img/customer.jpg{$Think.config.RESOURCE_VER}">-->
<!--</div>-->
</div>
</div>
<!-- 表单列表 -->
<div class="form-list">
	<ul class="list"></ul>
	<div class="submit-btn" style="background: {$themeColor};">提交</div>
</div>
<!-- 分享人信息 -->
<if condition="$contactInfo neq ''">
	<div class="contact_container">
		<if condition="$contactInfo['fullName'] eq ''">
			<h2>本页由<span>{$contactInfo['nickName']}</span>分享推荐</h2>
			<else/>
			<h2>本页由<span>{$contactInfo['fullName']}</span>分享推荐</h2>
		</if>
		<div class="contact_card">
			<div>
				<img src="{$contactInfo['headImgUrl']}" />
				<if condition="$contactInfo['fullName'] eq ''">
					<span>{$contactInfo['nickName']}</span>
					<else/>
					<span>{$contactInfo['fullName']}</span>
				</if>
			</div>
			<ul class="contact">
				<if condition="$contactInfo['phone'] neq '' AND $contactInfo['phoneTitle'] neq ''">
					<li onclick="page.clickCount(1, '{$contactInfo["phoneTitle"]}', {$contactInfo['phone']})">
						<a href="tel:{$contactInfo['phone']}">
							<i class="iconfont phone">&#xe659;</i>
							<span>{$contactInfo['phoneTitle']}</span>
						</a>
					</li>
				</if>
				<if condition="$contactInfo['qrcode'] neq '' AND $contactInfo['qrcodeTitle'] neq ''">
					<li onclick="page.clickCount(2, '{$contactInfo["qrcodeTitle"]}', '{$contactInfo["qrcode"]}')">
						<a>
							<i class="iconfont qrcode">&#xe68a;</i>
							<span>{$contactInfo['qrcodeTitle']}</span>
						</a>
					</li>
				</if>
				<if condition="$contactInfo['contactTel'] neq '' AND $contactInfo['contactTitle'] neq ''">
					<li onclick="page.clickCount(3, '{$contactInfo["contactTitle"]}', '{$contactInfo["contactTel"]}')">
						<a href="tel:{$contactInfo['contactTel']}">
							<i class="iconfont contact">&#xe709;</i>
							<span>{$contactInfo['contactTitle']}</span>
						</a>
					</li>
				</if>
			</ul>
		</div>
	</div>
	<script>
		var li = $(".contact_card li");
		var width = 100/li.length;
		li.css("width",width+"%");
	</script>
</if>
<!-- 加入营销圈按钮 -->
<if condition="$isShowQuqnIco eq 0">
	<!-- 按钮加号 -->
	<div class="btn-feild join-btn" style="background: {$themeColor};">
		<i class="iconfont">&#xe61f;</i>
		<div class="info">{$quanIcoFont}</div>
	</div>
<elseif condition="$isShowQuqnIco eq 1"/>
	<!-- 按钮我的 -->
	<div class="btn-feild my-btn" style="background: {$themeColor};">
		<i class="iconfont">&#xe663;</i>
		<div class="info">我的</div>
	</div>
<elseif condition="$isShowQuqnIco eq 2"/>
	<!-- 按钮我要分享 -->
	<div class="btn-feild switch-share" style="background: {$themeColor};">
		<div class="info">我要分享</div>
	</div>
</if>
<!-- 弹层 -->
<div class="quan-layer">
	<div class="bg"></div>
	<div class="layer-main">
		<div class="inner-box">
			<div class="top-feild">
				<eq name="isShowPoster" value="1">
					<a href='{$Think.config.SERVER_HOST}call.html?customerId={$customerId}&module=community&method=getPromotionCode&params=%7B"qid"%3A{$qId}%2C"module"%3A"micontent"%2C"moduleId"%3A"{$mId}"%2C"uId"%3A{$id}%7D' class="btn share-info">
						<div class="share-btn-wrapper" style="background: {$themeColor};">
							<i class="iconfont reward" style="background: {$themeColor};">&#xe615;</i>
						</div>
						<div>海报</div>
					</a>
				</eq>
				<neq name="rewardId" value="0">
					<a href="{$Think.config.SERVER_HOST}call.html?customerId={$customerId}&module=micontent&method=getRewardInfo&params=%7B%22micontentId%22%3A%22{$mId}%22%2C%22rewardId%22%3A%22{$rewardId}%22%7D" class="btn share-info">
						<div class="share-btn-wrapper" style="background: {$themeColor};">
							<i class="iconfont reward" style="background: {$themeColor};">&#xe632;</i>
						</div>
						<div>奖励</div>
					</a>
				</neq>
				<a href="javascript:;" class="btn share-info">
					<div class="share-btn-wrapper" style="background: {$themeColor};">
						<i class="iconfont" style="background: {$themeColor};">&#xe61c;</i>
					</div>
					<div>分享详情</div>
				</a>
				<div class="btn logo-btn">
					<div class="logo-wrapper">
						<img class="logo" src="{$quanLogo}">
					</div>
					<div>{$quanName}</div>
				</div>
			</div>
			<div class="close-btn iconfont">&#xe80c;</div>
		</div>
	</div>
</div>
<!-- 支付弹窗 -->
<div class="layer-pay">
	<div class="bg"></div>
	<div class="layer-box">
		<ul>
			<foreach name="payInfo.payType" item="vo">
				<li class="item">
					<label>
						<input type="radio" name="payType" value="{$vo.value}" <if condition="$vo.isDefault eq 1">checked</if>>
						<if condition="$vo.value eq 'wxpay'">
							<i class="iconfont" style="color: #04b310;">&#xe619;</i>
							<else />
							<i class="iconfont" style="color: #01aaef;">&#xe691;</i>
						</if>
						<div>{$vo.text}</div>
					</label>
				</li>
			</foreach>
			<li class="btns">
				<div class="cancel">取消</div>
				<div class="confirm">确定</div>
			</li>
		</ul>
	</div>
</div>

<script type="text/html" id="form-text-tpl">
	<li class="form-item name" id="<%=index + type%>">
		<div class="title"><%= name %></div>
		<div class="describe"><%= describe %></div>
		<%if(default){%>
		<input type="text" placeholder="<%= placeholder %>"  value="<%= default %>"  >
		<%}else{%>
		<input type="text" placeholder="<%= placeholder %>">
		<%}%>
	</li>
</script>
<!-- 视频 -->
<script type="text/javascript">
	$('video').each(function(elem, index) {
		$(elem).attr('preload', 'auto');
		elem.load();
	});
	// 跳转到关注页面
	function toFocusLink () {
		if ('{$focusLink}' && '{$focusLink}'.indexOf('http') < 0) {
			location.href = 'http://{$focusLink}'
		} else if ('{$focusLink}') {
			location.href = '{$focusLink}'
		}
	}
</script>

<!-- 表单渲染 -->
<script>
	var page = {
		init: function() {
			this.bindEvents();
			this.formList = new FormList();
			this.formList.init();
		},

		// 统计点击次数
		clickCount: function (type, title, content) {
			if (type == 2) {
				$('.mark').show();
				$('.qrcodeShow').show();
			}
			var data = {
				qid: '{$qId}', //密友圈id                
				miUid: '{$miUId}',  //miUid
				module: 'micontent',  //如果是文章,值为micontent
				moduleId: '{$mId}',  //文章id
				type: type,  //1:个人电话2:我的海报3:通用联系            //如果点击的是phoneTitle就是1
				title: title, //type对应的标题        phoneTitle/qrcodeTitle/contactTitle这三者的标题
				content: content //type对应的内容        phoneTitle对应的内容
			}
			$.ajax({
				type: 'get',
                url: '{$Think.config.SERVER_HOST}call.json?customerId={$customerId}',
                dataType: 'json',
                data: {
                   module: "community",
                   method: "saveClickContact",
                   params: JSON.stringify(data)
                },
				success (res) {
					console.log(res)
				}
			})
		},

		bindEvents: function() {
			$('.close-btn').click(function(){
				$('.quan-layer').css('display', 'none');
			});
			// 点击分享详情按钮
			$('.share-info').click(function(){
				$('.my-btn').click(function(){
					$('.quan-layer').css('display', 'none');
				});
				location.href = '{$Think.config.SERVER_HOST}call.html?customerId={$customerId}&module=micontent&method=getUserMiContentData&params=%7B%22miUid%22%3A{$miUId}%2C%22moduleId%22%3A{$mId}%2C%22type%22%3A%22share%22%2C%22start%22%3A0%2C%22limit%22%3A10%7D'
			})
			// 点击加入按钮跳转营销圈
			$('.join-btn').click(function(){
				var params = {
					qId: '{$relationQid}',
					source: 'article',
					community: 1,
					miUId: '{$miUId}',
					timeStamp: new Date(),
					sourceUrl: location.href // 当前文章链接
				}
				location.href = '{$Think.config.SERVER_NAME}/spa/index.html#/quan?scope=60&customerId={$customerId}&params=' + encodeURIComponent(JSON.stringify(params))
			});
			// 点击弹框中按钮跳转营销圈
			$('.quan-layer .logo-btn').click(function(){
				location.href = '{$Think.config.SERVER_NAME}/spa/index.html#/quan?scope=60&customerId={$customerId}&params=%7B%22qId%22%3A{$qId}%2C%22community%22%3A1%2C%20%22miUId%22%3A%20{$miUId}%7D';
			});
			// 点击我的按钮
			$('.my-btn').click(function(){
				$('.quan-layer').css('display', 'block');
			});
			// 点击我要分享按钮
			$('.switch-share').click(function() {
				var params = {
	        id: '{$mId}'
				}
				location.href = '{$Think.config.SERVER_HOST}call.html?customerId={$customerId}&module=micontent&method=getMiContentDetail&params=' + encodeURIComponent(JSON.stringify(params))
			})
			// 点击关闭弹框按钮
			$('.layer-pay .cancel').click(function(){
				$('.layer-pay').css('display', 'none');
			});

			// 判断当前文章模板
			if ('{$templateType}' == 2) {
				$('#materiaDetail .wechat-template').css('display', 'block');
			} else if ('{$templateType}' == 3) {
				$('#materiaDetail .article').css('margin', 0);
			}
		}
	}

	// 表单列表
	function FormList () {
		this.formList = [];
		this.formInfo = null;
		this.isLoading = false;
	}

	$.extend(FormList.prototype, {
		// 表单初始化
		init: function() {
			this.getFormInfo();
		},

		// 事件绑定
		bindEvents: function() {
			$('.submit-btn').click($.proxy(this.handleSubmitBtnClick, this));
			$('.confirm').click($.proxy(this.handlePayFormOrderBtnClick, this));
		},

		// 获取渲染表单所需信息
		getFormInfo: function() {
			try {
				this.formInfo = JSON.parse('{$formInfo|json_encode}') || [];
			} catch (err) {
				console.log(err)
				this.formInfo = []
			}
			if (this.formInfo.length > 0) {
				$('.form-list').css('display', 'block');
				this.render(this.formInfo);
				this.bindEvents();
			}
		},

		// 点击提交表单按钮
		handleSubmitBtnClick: function() {
			var that = this;
			var dataList = [];
			var isBreak = false;
			var needCheckPhoneCode = false;
			var phone = '';
			for (var i = 0; i < this.formList.length; i++) {
				var value = this.formList[i].getValue();
				if(this.formList[i].option.type === 'verifyPhone') {
					needCheckPhoneCode = true;
					phone = JSON.parse(value).value;
				}
				if (value === 'break') {
					isBreak = true;
					break;
				} else {
					JSON.parse(value).value && dataList.push(JSON.parse(value));
				}
			}
			if (!isBreak && needCheckPhoneCode && phone) {
				var params = {
					phone: phone,
					code: $('#code').val(),
					recall: 1
				}
				$.ajax({
						type: 'POST',
						url: '{$Think.config.SERVER_HOST}call.json?customerId={$customerId}',
						dataType: 'json',
						data: {
							 module: "phone",
							 method: "verifyPhoneCode",
							 params: JSON.stringify(params)
						},
						success: function(res){
							if (+res.code === 0) {
								that.submitForm(dataList);
							} else {
								$.util.alert(res.msg)
							}
						},
						error: $.proxy(this.handleAjaxError, this)
				});
			} else {
				!isBreak && this.submitForm(dataList);
			}
		},

		// 渲染表单
		render: function(data) {
			for (var i = 0; i < data.length; i++) {
				this.formList.push(new FormItem(data[i], i))
			}
		},

		// 发送请求提交数据
		submitForm: function(dataList) {
			if (this.isLoading) return
			this.isLoading = true
			var urlParams = $.util.getParamAsObject()
			var params = {
			    miUId: '{$miUId}', //miuid
			    type: 'form',
			    counts: 1,
			    qId: '{$qId}', //圈id
			    sId: '{$sId}', //分享的模块对应id
			    visitId: '{$visitId}', //访问id
			    pids: '{$formId}', //表单id
			    module: 'micontent', //模块名
			    moduleId: '{$mId}', //模块id
			    customizedInfo: dataList
            }
            $.ajax({
                type: 'POST',
                url: '{$Think.config.SERVER_HOST}call.json?customerId={$customerId}',
                dataType: 'json',
                data: {
                   module: "product",
                   method: "preSubmitOrder",
                   params: JSON.stringify(params)
                },
                success: $.proxy(this.handleSubmitSucc, this),
                error: $.proxy(this.handleAjaxError, this)
            });
		},

		// 提交数据成功后执行
		handleSubmitSucc: function(res) {
			if (res.code === 0) {
				if ('{$formType}' == 1) {
					this.orderId = res.oid;
					$('.layer-pay').css('display', 'block');
				} else {
					this.formOrderPay(res.oid)
				}
			} else if (+res.code === 15 || +res.code === 16) {
				$.util.alert(res.msg);
				setTimeout(function(){
					location.href = '{$Think.config.SERVER_HOST}call.html?customerId={$customerId}&module=personCenter&method=login&code=' + res.code + '&redirect_url=' + encodeURIComponent(location.href)
				}, 1000)
			} else {
				$.util.alert(res.msg);
				this.isLoading = false
			}
		},

		// 提交完成后调第二个接口或者选择完支付方式后调用
		formOrderPay: function(orderId, payType) {
			this.orderId = orderId;
			this.payType = payType;
			var params = {
			    orderId: orderId,
			    payType: payType || ''
      }
      $.ajax({
          type: 'get',
          url: '{$Think.config.SERVER_HOST}call.json?customerId={$customerId}',
          dataType: 'json',
          data: {
             module: "product",
             method: "formOrderPay",
             params: JSON.stringify(params)
          },
          success: $.proxy(this.handleFormOrderPaySucc, this),
          error: $.proxy(this.handleAjaxError, this)
      });
		},

		// 点击确认按钮支付
		handlePayFormOrderBtnClick: function() {
			var payType = ''
			$('input[name=payType]').each(function(){
				if ($(this).attr('checked') == true) payType = $(this).val();
			})
			this.formOrderPay(this.orderId, payType);
		},

		// 支付成功后执行
		handleFormOrderPaySucc: function(res) {
			var that = this
			var params = {
				id: this.orderId,
				jumpMode: '{$jumpMode}',
				jumpUrl: encodeURIComponent('{$jumpUrl}')
			}
			var url = '{$Think.config.SERVER_HOST}call.html?userName=&customerId={$customerId}&module=micontent&method=submitSucc&params=' + encodeURIComponent(JSON.stringify(params))
			if ('{$jumpMode}' == 1) url = '{$jumpUrl}'
			if (+res.code === 0) {
				location.href = url
			} else if (this.payType == 'wxpay') {
				try {
	        window.WeixinJSBridge.invoke('getBrandWCPayRequest', res.pkg, function (res) {
	          if (res.err_msg === 'get_brand_wcpay_request:ok') {
					$('.layer-pay').css('display', 'none');
					location.href = url
	          } else {
	            if (res.err_msg === 'get_brand_wcpay_request:cancel') {
	              return $.util.alert('操作已取消');
	            } else if (res.err_msg === 'get_brand_wcpay_request:fail') {
	              return $.util.alert('网络错误发送失败，请稍后再试');
	            } else if (res.err_msg === 'access_control:not_allow' || res.err_msg === 'system:access_denied') {
	              return $.util.alert('商家尚未开通微信支付');
	            } else {
	              return $.util.alert(res.err_msg);
	            }
	          }
	        })
	      } catch (e) {
	        $.util.alert('操作失败，请确保在微信浏览器中操作');
	      }
			} else if (this.payType == 'alipay') {
				sessionStorage.setItem('orderType', 'marketing');
				location.href = '{$Think.config.SERVER_HOST}call.html?customerId={$customerId}&module=product&method=orderBrowserOpen&params=%7B%22id%22%3A%22' + this.orderId + '%22%7D'
			} else {
				$.util.alert(res.msg);
			}
		},

		// ajax失败后执行
		handleAjaxError: function(err) {
			$.util.alert(err);
			this.isLoading = false;
		}
	})

	// 表单控件
	function FormItem (option, index) {
		this.option = option;
		if (!this.option.default) this.option.default = '';
		if (!this.option.placeholder) this.option.placeholder = '';
		if (!this.option.describe) {
			this.option.describe = '';
		} else {
			this.option.describe = '(' + this.option.describe + ')';
		}
		this.index = index;
		this.id = this.index + this.option.type;
		this.value = option.default;
		this.reg = '';
		this.init();
	}

	$.extend(FormItem.prototype, {
		// 表单控件初始化
		init: function() {
			this.render();
			this.bindEvents();
		},

		// 表单控件事件绑定
		bindEvents: function() {},

		judgeRequired: function() {
			if (this.option.requird == 1) {
				$('#' + this.id).find('.title').html('<span class="requird">*</span>' + this.option.name);
			}
		},

		// 父组件获取子组件value
		getValue: function() {
			var that = this;
			if (typeof this.value == 'object' && +this.option.requird === 1) {
				// 地址类型必填时的判断
				if (!this.value.provice) {
					$.util.alert('请输入' + this.option.name + '！');
					return 'break'
				}
				if (this.type === 'address' && !this.value.detail) {
					$.util.alert('请输入详细地址！');
					return 'break'
				}
			} else if (!this.value && +this.option.requird === 1) {
				// 必填字段未填的情况弹框提示
				$.util.alert('请输入' + this.option.name + '！');
				return 'break'
			} else if (this.value && this.reg && !this.reg.test(this.value)) {
				// 不符合正则验证的情况弹框提示
				$.util.alert('请输入正确的' + this.option.name + '！');
				return 'break'
			}
			if (this.option.type === 'verifyPhone' && !$('#code').val() && this.value) {
				$.util.alert('请输入验证码！')
				return 'break'
			}
			return JSON.stringify({
				name: this.option.name,
				type: this.option.type,
				value: this.value,
				other: {}
			})
		},

		// ajax失败后执行
		handleAjaxError: function(err) {
			$.util.alert(err);
		},

		// 表单控件dom渲染
		render: function() {
			switch (this.option.type) {
				case 'text':
				case 'name':
					this.renderText();
					break;
				case 'num':
					this.reg = /^[0-9.]*$/;
					this.renderText();
					break;
				case 'email':
					this.reg = /^.*@.*$/;
					this.renderText();
					break;
				case 'phone':
					this.reg = /^1[34578]\d{9}$/;
					this.renderText();
					break;
				case 'city':
				case 'address':
					this.renderAddress();
					break;
				case 'date':
					this.renderDate();
					break;
				case 'time':
					this.renderTime();
					break;
				case 'textarea':
					this.renderTextarea();
					break;
				case 'radio':
					this.renderRadio();
					break;
				case 'checkbox':
					this.renderCheckbox();
					break;
				case 'verifyPhone':
					this.countDown = 60;
					this.reg = /^1[34578]\d{9}$/;
					this.renderVerifyPhone();
					break;
			}
		},

		// 点击发送验证码按钮
		handleSmsBtnClick: function() {
			if (!this.value) {
				$.util.alert('请输入手机号！')
				return
			} else if (!this.reg.test(this.value)) {
				$.util.alert('请输入正确的手机号码！')
				return
			}
			if (this.countDown < 60) return
			var params = {
				phone: this.value,
				module: 'formManage'
			}
			$.ajax({
          type: 'get',
          url: '{$Think.config.SERVER_HOST}call.json?customerId={$customerId}',
          dataType: 'json',
          data: {
             module: "phone",
             method: "sendPhoneCode",
             params: JSON.stringify(params)
          },
          success: $.proxy(this.handleSendSmsSucc, this),
          error: $.proxy(this.handleAjaxError, this)
      });
		},

		// 发送短信成功后执行
		handleSendSmsSucc: function(res) {
			var that = this;
			if (+res.code === 0) {
				var timer = setInterval(function() {
					$('#sms-btn').text(that.countDown-- + 's后重新获取');
					$('#sms-btn').addClass('disabled');
					if (that.countDown <= 0) {
						clearInterval(timer);
						that.countDown = 60;
						$('#sms-btn').removeClass('disabled');
						$('#sms-btn').text('发送验证码');
					}
				}, 1000)
			} else {
				$.util.alert(res.msg)
			}
		},

		// 渲染单行文本框
		renderText: function() {
			console.log('渲染text');
			var that = this;
			var html = '<li class="form-item name" id="' + this.index + this.option.type + '">'
							+ '<div class="title">' + this.option.name + '</div>'
							+ '<div class="describe">' + this.option.describe + '</div>'
							+ '<input type="text" name="name" placeholder="' + this.option.placeholder + '" value="' + this.option.default + '">'
						+ '</li>'
			// 将dom插入页面
			$('.form-list .list').append(html);
			$('#' + this.id).find('input').on('change', function () {
				that.value = $(this).val().trim();
			});
			this.judgeRequired();
		},

		// 渲染带验证码的手机号
		renderVerifyPhone: function() {
			console.log('渲染带验证码的手机号');
			var that = this;
			var html = '<li class="form-item phone-code" id="' + this.index + this.option.type + '">'
								+ '<div class="phone">'
									+ '<div class="title">' + this.option.name + '</div>'
									+ '<div class="describe">' + this.option.describe + '</div>'
									+ '<input type="text" name="name" placeholder="' + this.option.placeholder + '" value="' + this.option.default + '">'
								+ '</div>'
								+ '<div class="code">'
									+ '<input type="text" id="code" placeholder="请输入验证码">'
									+ '<div class="sms-btn" id="sms-btn" style="background: {$themeColor}">发送验证码<div>'
								+ '</div>'
							+ '</li>'
			// 将dom插入页面
			$('.form-list .list').append(html);
			$('#' + this.id).find('input').eq(0).on('change', function () {
				that.value = $(this).val().trim();
			});
			$('#sms-btn').click($.proxy(this.handleSmsBtnClick, this))
			this.judgeRequired();
		},
		// 渲染地址类型
		renderAddress: function() {
			console.log('渲染地址类型');
			var that = this;
			that.value = {};
			var html = '<li class="form-item area" id="' + this.index + this.option.type + '">'
							+ '<div class="title">' + this.option.name + '</div>'
							+ '<div class="describe">' + this.option.describe + '</div>'
							+ '<input type="text" id="area' + this.id + '" readonly="" placeholder="' + this.option.placeholder + '"  value="' + this.option.default.split(',')[0] + '">'
							+ '<textarea placeholder="请输入详细地址" >' + (this.option.default ? this.option.default.split(',')[1] : '') + '</textarea>'
						+ '</li>'
			// 将dom插入页面
			$('.form-list .list').append(html);
			var arearPicker = mobiscroll.area('#area' + this.id, {
			    theme: 'ios',
			    display: 'bottom',
			    showLabel: true,
			    lang: 'zh',
			    onSet : function(event, inst){
			    	that.value.provice = inst.DataArray[0].area_name || '';
			    	that.value.city = inst.DataArray[1].area_name || '';
			    	that.value.county = inst.DataArray[2].area_name || '';
			    }
			});
			if (this.option.default) {
				var d = this.option.default.split(',')[0].split(' ');
				that.value.provice = d[0] || '';
				that.value.city = d[1] || '';
				that.value.county = d[2] || '';
			}
			if (that.option.type === 'city') {
				$('#' + this.id).find('textarea').css('display', 'none');
			} else {
				$('#' + that.id).find('textarea').on('change', function () {
					that.value.detail = $('#' + that.id).find('textarea').val();
				})
				if (that.option.default) that.value.detail = that.option.default.split(',')[1]
			}
			this.judgeRequired();
		},

		// 渲染时间类型
		renderTime: function() {
			console.log('渲染时间类型');
			var that = this;
			var html = '<li class="form-item date" id="' + this.index + this.option.type + '">'
							+ '<div class="title">' + this.option.name + '</div>'
							+ '<div class="describe">' + this.option.describe + '</div>'
							+ '<input id="time" type="text" readonly="" placeholder="' + this.option.placeholder + '"  value="' + this.option.default + '">'
						+ '</li>'
			$('.form-list .list').append(html);
			var timePicker = mobiscroll.time('#time');
			timePicker.option({
			    theme: 'ios',
			    lang: 'zh',
			    onSet : function(event, inst){
			    	that.value = inst._value;
			    }
			});
			this.judgeRequired();
		},

		// 渲染日期类型
		renderDate: function() {
			console.log('渲染日期类型');
			var that = this;
			var html = '<li class="form-item date" id="' + this.index + this.option.type + '">'
							+ '<div class="title">' + this.option.name + '</div>'
							+ '<div class="describe">' + this.option.describe + '</div>'
							+ '<input id="date" type="text" readonly="" placeholder="' + this.option.placeholder + '"  value="' + this.option.default + '">'
						+ '</li>'
			$('.form-list .list').append(html);
			var datePicker = mobiscroll.date('#date');
			datePicker.option({
			    theme: 'ios',
			    lang: 'zh',
			    onSet : function(event, inst){
			    	that.value = inst._value;
			    }
			});
			this.judgeRequired();
		},

		// 渲染textarea
		renderTextarea: function() {
			console.log('渲染textarea');
			var that = this;
			var html = '<li class="form-item textarea" id="' + this.index + this.option.type + '">'
							+ '<div class="title">' + this.option.name + '</div>'
							+ '<div class="describe">' + this.option.describe + '</div>'
							+ '<textarea placeholder="' + this.option.placeholder + '" >' + this.option.default + '</textarea>'
						+ '</li>'
			$('.form-list .list').append(html);
			$('#' + this.id).find('textarea').on('change', function () {
				that.value = $(this).val();
			});
			this.judgeRequired();
		},

		// 渲染radio
		renderRadio: function() {
			console.log('渲染radio');
			var that = this;
			var radios = this.option.options.split(',')
			var html = '<li class="form-item radio" id="' + this.index + this.option.type + '">'
							+ '<div class="title">' + this.option.name + '</div>'
							+ '<div class="describe">' + this.option.describe + '</div>'
							+ '<ul>'
			for (var i = 0; i < radios.length; i++) {
				html += '<li><label><input type="radio" value="' + radios[i] + '" name="' + this.option.name + '" class="mgr mgr-sm" />' + radios[i] + '</label></li>'
			}
			html += '</ul></li>';
			$('.form-list .list').append(html);
			$('#' + this.id).find('input').on('click', function () {
				that.value = $(this).val();
			});
			this.judgeRequired();
		},

		// 渲染checkbox
		renderCheckbox: function() {
			console.log('渲染checkbox');
			var that = this;
			var checkboxs = this.option.options.split(',')
			var html = '<li class="form-item checkbox" id="' + this.index + this.option.type + '">'
							+ '<div class="title">' + this.option.name + '</div>'
							+ '<div class="describe">' + this.option.describe + '</div>'
							+ '<ul>'
			for (var i = 0; i < checkboxs.length; i++) {
				html += '<li><label><input type="checkbox" value="' + checkboxs[i] + '" class="mgc mgc-sm"/>' + checkboxs[i] + '</label></li>'
			}
			html += '</ul></li>';
			$('.form-list .list').append(html);
			$('#' + this.id).find('input').on('click', function () {
				var checkedList = [];
				$('#' + that.id).find('input').each(function () {
					$(this).attr('checked') && checkedList.push($(this).val());
				})
				that.value = checkedList.join(',');
			});
			this.judgeRequired();
		}
	})

	page.init();

</script>
<script>
	var baseUrl = '{$Think.config.SERVER_HOST}';
	var hrefPath = baseUrl+'call.html?';
	var pros={$prodetail};
	var isQuan = '{$isQuan}';
	var shareData = {
			visitId: "{$visitId}",
			lastShareUId: '{$lastShareUId}'
	}
	var autoTextarea = function (elem, extra, maxHeight) {
		if(isQuan==0){
			return;
		}
		extra = extra || 0;
		var isFirefox = !!document.getBoxObjectFor || 'mozInnerScreenX' in window,
				isOpera = !!window.opera && !!window.opera.toString().indexOf('Opera'),
				addEvent = function (type, callback) {
					elem.addEventListener ?
							elem.addEventListener(type, callback, false) :
							elem.attachEvent('on' + type, callback);
				},
				getStyle = elem.currentStyle ? function (name) {
					var val = elem.currentStyle[name];
					if (name === 'height' && val.search(/px/i) !== 1) {
						var rect = elem.getBoundingClientRect();
						return rect.bottom - rect.top -
								parseFloat(getStyle('paddingTop')) -
								parseFloat(getStyle('paddingBottom')) + 'px';
					};
					return val;
				} : function (name) {
					return getComputedStyle(elem, null)[name];
				},
				minHeight = parseFloat(getStyle('height'));
		elem.style.resize = 'none';
		var change = function () {
			var scrollTop, height,
					padding = 0,
					style = elem.style;
			if (elem._length === elem.value.length) return;
			elem._length = elem.value.length;
			if (!isFirefox && !isOpera) {
				padding = parseInt(getStyle('paddingTop')) + parseInt(getStyle('paddingBottom'));
			};
			scrollTop = document.body.scrollTop || document.documentElement.scrollTop;
			elem.style.height = minHeight + 'px';
			if (elem.scrollHeight > minHeight) {
				if (maxHeight && elem.scrollHeight > maxHeight) {
					height = maxHeight - padding;
					style.overflowY = 'auto';
				} else {
					height = elem.scrollHeight - padding;
					style.overflowY = 'hidden';
				};
				style.height = height + extra + 'px';
				scrollTop += parseInt(style.height) - elem.currHeight;
				document.body.scrollTop = scrollTop;
				document.documentElement.scrollTop = scrollTop;
				elem.currHeight = parseInt(style.height);
			};
		};
		addEvent('input', change);
		change();
	};
	// 产品
	var product={
		share:function(){
			var p=$.util.getParamAsObject();
			$.req.get("call.json?customerId={$customerId}&module=quan&method=saveShare",{
				params:{
					"qId":"{$qId}",
					"sId":"{$sId}",
					"guid":"{$guid}",
					"fromGuid":p.fromGuid,
					"miUId":"{$miUId}",
					"shareType":1,
					"fromPage":"micontent_detail"
				}
			},function(data){
				if(data && !data.code){

				}
			});
		},
		toOther:function(id){
			if(isQuan==1){
				var p=$.util.getParamAsObject();
				p.id=id;
			}else{
				var p = {
					"id":id
				}
			}
			p=encodeURIComponent(JSON.stringify(p));
			location.href=baseUrl+'call.html?customerId={$customerId}&module=micontent&method=getMiContentDetail&params='+p;
		},
		goShop:function(){
			var shareUrl="";
			var params={
				"qId":"{$qId}",
				"fromUId":"{$miUId}"
			};
			params=encodeURIComponent(JSON.stringify(params));
			location.href=baseUrl+'call.html?customerId={$customerId}&module=quan&scope=1&method=shopStart&params='+params;
		},
		toDetail:function(customerId,id){
			var p=$.util.getParamAsObject();
			if(p&& p.qId){
				var params={
					"id":id,
					"miUId":p.miUId,
					"qId":p.qId,
					"fromGuid":p.fromGuid
				}
			}else{
				var params={
					"id":id
				}
			};
			params=encodeURIComponent(JSON.stringify(params));
			location.href= baseUrl+'call.html?customerId='+customerId+'&module=product&method=getProduct&params='+params;
		},
		getShareUrl:function(){
			var p=$.util.getParamAsObject();
			var qId= p.qId||"{$qId}";
			var miUId= p.miUId||"{$miUId}";
			if(qId&& miUId){
				var params={
					id: p.id,
					fromUserName: '{$userName}',
					qId: qId,
					miUId: miUId,
					visitId: shareData.visitId,
					lastShareUId: shareData.lastShareUId,
					recommenderId: shareData.lastShareUId,
					saleSourceUid: '{$saleSourceUid}'
				}
			}else{
				var params={
					id: p.id,
					fromUserName: '{$userName}',
					visitId: shareData.visitId,
					lastShareUId: shareData.lastShareUId,
					recommenderId: shareData.lastShareUId,
					saleSourceUid: '{$saleSourceUid}'
				}
			}
			params=encodeURIComponent(JSON.stringify(params));
			shareUrl=baseUrl+'call.html?customerId={$customerId}&module=micontent&method=getMiContentDetail&params='+params;
			return shareUrl;
		}
	}
	var shareUrl=product.getShareUrl();
	wx_share.init({
				title: decodeURI('{$shareTitle|rawurlencode}') || decodeURI('{$title|rawurlencode}'),
				desc: decodeURI('{$description|rawurlencode}'),
				link: shareUrl,
				imgUrl:'{$shareImg}' || '{$picUrl}',
				pkg:{
					appId: '{$pkg.appId}',
					timestamp: '{$pkg.timestamp}',
				nonceStr: '{$pkg.nonceStr}',
				signature: '{$pkg.signature}',
			},
			success:function(config,shareType){
				var p=$.util.getParamAsObject();
				$.ajax({
					url: baseUrl + "call.json?customerId={$customerId}&module=quan&method=saveShare",
					method: 'get',
					async: false,
					dataType: "json",
					data: {
						params: JSON.stringify({
							qId:'{$qId}',
							sId:'{$sId}',
							guid:'{$guid}',
							fromGuid:p.fromGuid,
							miUId:'{$miUId}',
							shareType:shareType,
							fromPage:'micontent_detail',
							visitId:shareData.visitId,
							lastShareUId:shareData.lastShareUId,
							saleSourceUid: '{$saleSourceUid}'
						})
					}
				})
			}
	});
</script>
</body>
</html>